<!DOCTYPE html>
<html lang="en">
<head style="background-color: black">
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/bootstrap.css">
    <style>
        span{
            font-size: 20px;
            color: #2ed2c1;
        }
        .box{
            flex-wrap: wrap;
        }rap |

        ul li{
            list-style-type:none;
        }
        *{padding:0; margin:0}
        .lbt{
            height: 580px;
            background-image: url("image/bannerbg.png")

        }
        section{
            margin-top: -20px;
        }
        .carousel-indicators{

            margin:0 auto;
        }
        .bgimg{
            margin-left: 175px;
            display: flex;
            justify-content:end;

        }
        .bgimg li {

            margin-right: 20px;
            flex-wrap:wrap;
            list-style-type:none;

            align-content:flex-start;

        }
        .bgimg li div{
            padding: 5px 5px 5px 5px;
            border: 1px red solid;
        }
        .bgimg p{
            width: 150px;
        }
    </style>

</head>
<body>

<header>

    <nav class="navbar navbar-inverse">


        <img src="image/logoMsg.png" >
        <div class="btn-group" role="group" aria-label="...">
            asdasd
            <button type="button" class="btn btn-default" style="background-color:black; ">全国</button>


            <div class="btn-group" role="group">
                <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    演出
                    <span class="caret"></span>
                </button>
                <ul class="dropdown-menu">
                    <li><a href="#">Dropdown link</a></li>
                    <li><a href="#">Dropdown link</a></li>
                </ul>
            </div>
            <button type="button" class="btn btn-default">电影</button>
            <button type="button" class="btn btn-default">我的微票</button>
        </div>
    </nav>

</header>
<section >

    <div class="lbt">
        <div id="carousel-example-generic" class="carousel slide" data-ride="carousel" style="   display: inline-block;padding-top:
90px;padding-left: 20px" >
            <!-- Indicators -->
            <ol class="carousel-indicators">
                <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                <li data-target="#carousel-example-generic" data-slide-to="2"></li>
                <li data-target="#carousel-example-generic" data-slide-to="3"></li>
                <li data-target="#carousel-example-generic" data-slide-to="4"></li>
            </ol>

            <!-- Wrapper for slides -->
            <div class="carousel-inner" role="listbox">
                <div class="item active">

                    <img src="image/1.jpg" height="400" width="875"/>
                    <div class="carousel-caption">
                        ...
                    </div>
                </div>
                <div class="item">

                    <img src="image/2.jpg" height="400" width="875"/>
                    <div class="carousel-caption">
                        ...
                    </div>
                </div>
                <div class="item">

                    <img src="image/3.jpg" height="400" width="875"/>
                    <div class="carousel-caption">
                        ...
                    </div>
                </div>
                <div class="item">

                    <img src="image/4.jpg" height="400" width="875"/>
                    <div class="carousel-caption">
                        ...
                    </div>
                </div>
                <div class="item">

                    <img src="image/5.1.jpg" height="400" width="875"/>
                    <div class="carousel-caption">
                        ...
                    </div>
                </div>
            </div>


        </div>



        <div style="width: 300px;height: 400px;background-color: white;float: right;display: inline-block;margin-top: 90px;margin-right: 10px">
                  <h1 style="padding-left:20px ">特惠看</h1>
            <img src="image/img1.jpg" height="105" width="252"style="padding-left:20px "/>
            <ul style="margin: 20px;list-style-type:none ">
                <li>
                    <div class="list-group">
                        <a href="#" >
                            <h4 class="list-group-item-heading">[苏州]2016迷笛电子音乐节（预售）</h4>

                        </a>
                    </div>
                </li>
                <li>
                    <div class="list-group">
                        <a href="#" >
                            <h4 class="list-group-item-heading">穿着花裤子喝着小酒通宵达旦</h4>

                        </a>
                    </div>
                </li>
                <li>
                    <div class="list-group">
                        <a href="#" >
                            <h4 class="list-group-item-heading">2016刘若英世界巡回演唱会</h4>

                        </a>
                    </div>
                </li>
                <li>
                    <div class="list-group">
                        <a href="#" >
                            <h4 class="list-group-item-heading">[上海]百老汇经典音乐剧--《狮子王》</h4>

                        </a>
                    </div>
                </li>
            </ul>

        </div>


        <div style="margin-top: 110px;">
            <ul class="bgimg" >
                <li>
                    <div>
                    <img src="image/5.jpg" height="200" width="170"/></br>
                    <!--<p style="margin-top: 10px;margin-left: 10px">[上海]百老汇经典音乐剧</p></br><p style="margin-top: -10px">《狮子王》</p>-->
                    <p style="flex-wrap:wrap;margin-left: 10px;margin-right: 10px">[上海]百老汇经典音乐剧《狮子王》</p>
                    </div>
                </li>
                <li>
                    <div>
                    <img src="image/6.jpg" height="200" width="170"/></br>
                    <!--<br style="margin-top: 10px;margin-left: 10px">[北京]陈奕迅 ANOTHER</br>EASON'S LIFE演唱会北京站</p></br>-->
                    <!--<p style="margin-top: -10px">《狮子王》</p>-->
                    <p style="flex-wrap:wrap;margin-left: 10px;margin-right: 10px">[北京]陈奕迅 ANOTHER EASON'S LIFE演唱会北京站</p>
                    </div>
                </li>
                <li>
                    <div>
                    <img src="image/7.jpg" height="200" width="170"/></br>
                    <!--<p style="margin-top: 10px;margin-left: 10px">[上海]百老汇经典音乐剧</p></br><p style="margin-top: -10px">《狮子王》</p>-->
                    <p style="flex-wrap:wrap;margin-left: 10px;margin-right: 10px">[深圳]逃跑计划2016巡回演唱会深圳站</p>
                    </div>
                </li>
                <li>
                    <div>
                    <img src="image/8.jpg" height="200" width="170"/></br>
                  <p style="flex-wrap:wrap;margin-left: 10px;margin-right: 10px">[北京]BJCC北京漫控潮流博览会</p>
                    </div>
                </li>
            </ul>

            <img src="image/ad1.jpg" height="142" width="1170" style="display:block;margin-left:auto;margin-right:auto;"/>
        </div>
        <div>
            <ul class="bgimg" style="margin-top: 50px;margin-bottom: -90px">
                <li> 演唱会</li>
                <li> 体育赛事</li>
                <li> 舞台剧</li>
                <li> 儿童亲子</li>
                <li>音乐会</li>
                <li>展览活动</li>
            </ul>
        </div>




        <div style="margin-top: 110px;">
            <ul class="bgimg" >
                <li>
                    <div>


                        <img src="image/9.jpg" height="200" width="170"/></br>
                        <!--<p style="margin-top: 10px;margin-left: 10px">[上海]百老汇经典音乐剧</p></br><p style="margin-top: -10px">《狮子王》</p>-->
                        <p style="flex-wrap:wrap;margin-left: 10px;margin-right: 10px">
                            [苏州]2016迷笛电子音乐节
                            </br>
                           <span> 180</span>元起</p>
                    </div>
                </li>
                <li>
                    <div>

                        <img src="image/10.jpg" height="200" width="170"/></br>
                        <!--<br style="margin-top: 10px;margin-left: 10px">[北京]陈奕迅 ANOTHER</br>EASON'S LIFE演唱会北京站</p></br>-->
                        <!--<p style="margin-top: -10px">《狮子王》</p>-->
                        <p style="flex-wrap:wrap;margin-left: 10px;margin-right: 10px">[深圳]逃跑计划2016巡回演唱会深圳站
                            </br>
                            <span>180</span>元起</p>
                    </div>
                </li>
                <li>
                    <div>


                        <img src="image/11.jpg" height="200" width="170"/></br>
                        <!--<p style="margin-top: 10px;margin-left: 10px">[上海]百老汇经典音乐剧</p></br><p style="margin-top: -10px">《狮子王》</p>-->
                        <p style="flex-wrap:wrap;margin-left: 10px;margin-right: 10px">[北京]陈奕迅 ANOTHER EASON'S LIFE演唱会北京站
                            </br>
                            <span>380</span>元起</p>
                    </div>
                </li>
                <li>
                    <div>

                        <img src="image/12.jpg" height="200" width="170"/></br>
                        <!--<br style="margin-top: 10px;margin-left: 10px">[北京]陈奕迅 ANOTHER</br>EASON'S LIFE演唱会北京站</p></br>-->
                        <!--<p style="margin-top: -10px">《狮子王》</p>-->
                        <p style="flex-wrap:wrap;margin-left: 10px;margin-right: 10px">[青岛]周杰伦2016世界巡回演唱会青岛站(即将开售)
                            </br>
                           <span> 380</span>元起</p>
                    </div>
                </li>
            </ul>
                <ul class="bgimg" >
                <li>
                    <div>


                        <img src="image/13.jpg" height="200" width="170"/></br>
                        <!--<p style="margin-top: 10px;margin-left: 10px">[上海]百老汇经典音乐剧</p></br><p style="margin-top: -10px">《狮子王》</p>-->
                        <p style="flex-wrap:wrap;margin-left: 10px;margin-right: 10px">[太原]周杰伦2016世界巡回演唱会太原站(预售) 280元起
                            </br>
                           <span> 280</span>元起</p>
                    </div>
                </li>
                <li>
                    <div>

                        <img src="image/14.jpg" height="200" width="170"/></br>
                        <!--<br style="margin-top: 10px;margin-left: 10px">[北京]陈奕迅 ANOTHER</br>EASON'S LIFE演唱会北京站</p></br>-->
                        <!--<p style="margin-top: -10px">《狮子王》</p>-->
                        <p style="flex-wrap:wrap;margin-left: 10px;margin-right: 10px">[太原]2016 李荣浩「有 理想」世界巡回演唱会-太原站
                            </br>
                           <span> 280</span>元起</p>
                    </div>
                </li>
                <li>
                    <div>


                        <img src="image/15.jpg" height="200" width="170"/></br>
                        <!--<p style="margin-top: 10px;margin-left: 10px">[上海]百老汇经典音乐剧</p></br><p style="margin-top: -10px">《狮子王》</p>-->
                        <p style="flex-wrap:wrap;margin-left: 10px;margin-right: 10px">[深圳]徐佳莹“日全蚀”深圳演唱会
                            </br>
                            <span>280</span>元起</p>
                    </div>
                </li>
                <li>
                    <div><img src="image/16.jpg" height="200" width="170"/>

                        </br>
                        <!--<br style="margin-top: 10px;margin-left: 10px">[北京]陈奕迅 ANOTHER</br>EASON'S LIFE演唱会北京站</p></br>-->
                        <!--<p style="margin-top: -10px">《狮子王》</p>-->
                        <p style="flex-wrap:wrap;margin-left: 10px;margin-right: 10px">[太原]2016刘若英"Renext 我敢"世界巡回演唱会太原站
                            </br>
                            <span>380</span>元起</p>
                    </div>
                </li>

            </ul>
            <h3 style="margin-left: 175px;">馆场推荐</h3>
            <ul class="bgimg" >

                <li>
                    <div>


                        <img src="image/img7.jpg" height="240" width="424"/></br>
                        <!--<br style="margin-top: 10px;margin-left: 10px">[北京]陈奕迅 ANOTHER</br>EASON'S LIFE演唱会北京站</p></br>-->
                        <!--<p style="margin-top: -10px">《狮子王》</p>-->
                        <p style="flex-wrap:wrap;margin-left: 10px;margin-right: 10px">[太原]2016刘若英"Renext 我敢"世界巡回演唱会太原站
                            </br>
                            <span>380</span>元起</p>
                    </div>
                </li>
                <li>
                    <div>

                        <img src="image/img8.jpg" height="240" width="424"/></br>
                        <!--<br style="margin-top: 10px;margin-left: 10px">[北京]陈奕迅 ANOTHER</br>EASON'S LIFE演唱会北京站</p></br>-->
                        <!--<p style="margin-top: -10px">《狮子王》</p>-->
                        <p style="flex-wrap:wrap;margin-left: 10px;margin-right: 10px">[太原]2016刘若英"Renext 我敢"世界巡回演唱会太原站
                            </br>
                            <span>380</span>元起</p>
                    </div>
                </li>

            </ul>



        </div>

    </div>

</section>

<!--<footer style="height: 100px;background-color: black;">sdfvdgsdgdggsdhsdgdgadhwdgdasghrhbdstrgerse</footer>-->




<script src="js/jquery-1.12.4.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/vue.js"></script>

</body>
</html>